import React from 'react';
import pass from '../../assets/css/user/pass.module.css'
import login from "../../assets/css/login/login.module.css";
import {Toast} from "antd-mobile";

export default class PasswordComponent extends React.Component{
    constructor(){
        super();
        this.state={
            show:true,
            img:'',
            uid:localStorage.uid
        }
    }
    goBack(){
        this.props.history.goBack()
    }
    imgClick(){
        this.setState({show:!this.state.show});
        if (this.state.show===true){
            this.refs.img.type = 'text';
        } else {
            this.refs.img.type = 'password';
        }
    }
    Btn(){
        if (this.state.img!==''){
            const params=new URLSearchParams();
            params.append('password',this.state.img);
            params.append('uid',this.state.uid);
            fetch('http://vueshop.glbuys.com/api/user/myinfo/modpwd?token=1ec949a15fb709370f',{
                method:'POST',
                body:params
            }).then((res)=>res.json())
                .then(res=>{
                    console.log(res);
                    if (res.code===200){
                        // localStorage['password']=this.state.img;
                        localStorage['uid']='';
                        localStorage['isLogin']='';
                        localStorage['nickname']='';
                        this.props.history.push('/login/login')
                    }else {
                        Toast.info(res.data, 1);
                    }
                })
        }else {
            Toast.info('请输入密码', 1);
        }
    }

    render() {
        return(
            <div className={pass.boxPass}>
                <div>
                    <img src={require("../../assets/images/home/goods/back.png")} onClick={this.goBack.bind(this)} alt=""/>
                    <span>修改密码</span>
                </div>
                <div className={pass.boxDiv}>
                    <p>
                        <input type='password' placeholder='请输入不小于6位的密码' ref='img' onChange={(e)=>{
                            this.setState({img:e.target.value})
                        }}/>
                        <img src={require('../../assets/images/user/my/f1.png')} alt='' className={this.state.show?login.show:login.hide}
                             onClick={this.imgClick.bind(this)}/>
                        <img src={require('../../assets/images/user/my/f2.png')} alt='' className={!this.state.show?login.show:login.hide}
                             onClick={this.imgClick.bind(this)}/>
                    </p>
                    <button onClick={this.Btn.bind(this)}>提交</button>
                </div>
            </div>
        )
    }
}